<template>
  <div class="getBackAdvance">
    <div v-if="type === 1">
      <p class="title"> <i class="el-icon-success success"></i> <span class="subTitle">取回成功</span></p>
      <p class="msg">您已成功取回预付款</p>
    </div>
    <div v-if="type === 2">
      <p class="title"> <i class="el-icon-error error"></i> <span class="subTitle">取回失败</span></p>
      <p class="msg">该账户创建 {{ coin }} 资产时消耗对RAM未全部收回</p>
      <a href="javascript:;" class="link">了解更多</a>
    </div>
    <div v-if="type === 3">
      <p class="title"> <i class="el-icon-error error"></i> <span class="subTitle">取回失败</span></p>
      <p class="msg">您仍有 {{ coin }} 的交易【 <span class="green">买单</span> 】未完成，请先撤销</p>
      <a href="javascript:;" class="link">了解更多</a>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
    }
  },
  props: [
    'coin', // 币种名称
    'type', // 取回预付款结果
  ],
  created() {
  },
  mounted() {
  },
  methods: {
  }
}
</script>

<style scoped lang="scss">
.getBackAdvance{
  padding-bottom: 15px;

  i{
    display: inline-block;
    font-size: 28px;
  }

  .title{
    font-size: 16px;
    font-weight: bold;
    position: relative;
    padding-left: 30px;

    .subTitle{
      display: inline-block;
      line-height: 28px;
      position: absolute;
      padding-left: 15px;
    }
  }

  .msg,.link{
    padding-left: 73px;
    color: #999;
  }

  .link{
    color: #3596dc;
  }

  .success{
    color: #66c23a;
  }

  .error{
    color: #f56c6c;
  }

  .green{
    color: #7bce54;
  }
}
</style>
